<div ng-controller="imageCtrl" lazy="search()">
	<div waterfall data="images" as="img" start="1">
		<span upload-image url="@{Resources.image_upload}" success="add" ext="png,jpg,jpeg,bmp"></span>
		<div class="fade-animate waterfall-elem" article="img" autoheight="true">
			<a href="#" ng-click="del(img, n)"><i class="fa fa-trash"></i> &{'app.common.button.del'}</a>
		</div>
	</div>
</div>

<script type="text/javascript">
'use strict'
var imageCtrl = ['$scope', '$http', function($scope, $http) {
	// 定义方法
	angular.extend($scope, {
		init: function() {
			
		}, search: function() {
			// 初始化当前页号
			if (angular.isUndefined($scope.images_current)) $scope.images_current = 1;
			
			// 仅当总页数为空或小于等于当前页数时进行加载数据
			if (angular.isUndefined($scope.images_total) || $scope.images_total >= $scope.images_current) {
				$http({
					method: 'post',
					url: '@{Resources.image_search}',
					data: jQuery.param({page: $scope.images_current, size: 20}),
					headers: {'Content-Type': 'application/x-www-form-urlencoded'}
				}).success(function(data) {
					var parsed = [];
					angular.forEach(data.content, function(d, i) {
						parsed.push({id: d.id, picUrl: d.path});
					});
					$scope.images = parsed;
					$scope.images_total = data.totalPage;
					$scope.images_current = $scope.images_current + 1;
				});
			}
		}, add: function(img) {
			$scope['images_lane'][1].splice(0, 0, {id: img.id, picUrl: img.path});
		}, del: function(img, idx) {
			$http({
				method: 'get',
				url: '@{Resources.image_delete}?id=' + img.id,
				headers: {'Content-Type': 'application/x-www-form-urlencoded'}
			}).success(function(data) {
				$scope.remove(img, $scope['images_lane'][idx]);
			});
		}
	});
	
	// 初始化
	$scope.init();
}];
</script>
